<template>
  <el-calendar v-model="curDate">
    <template #dateCell="{ date, data }">
      {{ data.day.split('-').pop() }}
      <span v-if="isWeekend(date) === '休'" class="rest">{{ isWeekend(date) }}</span>
    </template>
  </el-calendar>
</template>

<script>
export default {
  data() {
    return {
      curDate: new Date()
    }
  },
  methods: {
    isWeekend(date) {
      return date.getDay() === 6 || date.getDay() === 0 ? '休' : ''
    }
  }
}
</script>
<style scoped lang="scss">
.rest {
  color: #fff;
  border-radius: 50%;
  background: rgb(250, 124, 77);
  width: 20px;
  height: 20px;
  margin-left: 20px;
  display: inline-block;
  text-align: center;
  line-height: 20px;
}
</style>